<template>
  <div class="filter-input">
    <el-input
      v-model="query.blurry"
      size="small"
      placeholder="模糊搜索"
      style="width: 200px;"
      class="filter-item"
    />
    <el-button type="primary" icon="el-icon-search" @click="$emit('search')">查 询</el-button>
    <el-button type="warning" icon="el-icon-refresh" @click="handleReset">重 置</el-button>
    <el-button type="success" icon="el-icon-plus" @click="handleAdd">新 增</el-button>
    <Menu :show-menu.sync="showMenu" :title="'新增菜单'" @search="$emit('search')" />
  </div>
</template>
<script>
import Menu from './Menu'
export default {
  components: {
    Menu
  },
  data() {
    return {
      query: {
        blurry: ''
      },
      showMenu: false
    }
  },
  methods: {
    handleReset() {
      this.query.blurry = ''
      this.$emit('search')
    },
    handleAdd() {
      this.showMenu = true
    }
  }
}
</script>
<style scoped lang="scss">
.filter-input{
    margin-bottom: 20px;
}
</style>
